
<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>test</title>
    <meta name="description" content="test">
    <link rel="stylesheet" href="./cdn/index.css">
    <script src="./cdn/vue.global.js"></script>
    <script src="./cdn/index.full.js"></script>
    <script src="./cdn/axios.min.js"></script>
    <script src="./js/config.js"></script>
    <script src="./js/axios.js"></script>
  </head>
  <body>
    <div id="counter">
        <div class="mb-4">
            <el-button @click="dialogVisible1=true" type="primary">打包项目</el-button>
            <el-button @click="dialogVisible2=true" type="danger">文件同步</el-button>
        </div>
        <el-dialog v-model="dialogVisible1" title="打包项目" width="640" :close-on-click-modal="false">
            <div class="dialog-con">
                <el-form
                    ref="ruleFormRef1"
                    style="max-width:600px"
                    :model="ruleForm1"
                    label-width="auto"
                >
                    <el-form-item label="打包渠道:" prop="type">
                        <el-select v-model="ruleForm1.type" placeholder="请选择">
                            <el-option label="h5" value="h5"></el-option>
                            <el-option label="weixin" value="weixin"></el-option>
                            <el-option label="alipay" value="alipay"></el-option>
                            <el-option disabled label="baidu" value="baidu"></el-option>
                            <el-option disabled label="jd" value="jd"></el-option>
                            <el-option disabled label="kuaishou" value="kuaishou"></el-option>
                            <el-option disabled label="qq" value="qq"></el-option>
                            <el-option disabled label="toutiao" value="toutiao"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="项目路径:" prop="projectUrl">
                        <el-input
                            v-model="ruleForm1.projectUrl"
                        ></el-input>
                    </el-form-item>
                    <el-form-item>
                        <div style="width: 100%;text-align: right;">
                            <el-button @click="dialogVisible1=false">取消</el-button>
                            <el-button type="primary" @click="submitForm1" :loading="buildBtnLoading">确定</el-button>
                        </div>
                    </el-form-item>
                </el-form>
            </div>
        </el-dialog>
        <el-dialog v-model="dialogVisible2" title="同步文件" width="640" :close-on-click-modal="false">
            <div class="dialog-con">
                <el-form
                    ref="ruleFormRef2"
                    style="max-width:640px"
                    :model="ruleForm2"
                    label-width="auto"
                >
                    <el-form-item label="源路径:" prop="past">
                        <el-input
                            v-model="ruleForm2.past"
                        />
                    </el-form-item>
                    <el-form-item label="新路径:" prop="new">
                        <el-input
                            v-model="ruleForm2.new"
                        />
                    </el-form-item>
                    <el-form-item>
                        <div style="width: 100%;text-align: right;">
                            <el-button @click="dialogVisible2=false">取消</el-button>
                            <el-button type="primary" @click="submitForm2" :loading="fileSyncBtnLoading">确定</el-button>
                        </div>
                    </el-form-item>
                </el-form>
            </div>
        </el-dialog>
    </div>
    <script>
        const {createApp,ref,reactive}=Vue;
        const buildBtnLoading=ref(false);
        const dialogVisible1=ref(false);
        const ruleForm1 = ref({
            type: 'h5',
            projectUrl: '/Users/yinkaiyan/Desktop/my/uniapp/'
        });
        const fileSyncBtnLoading=ref(false);
        const dialogVisible2=ref(false);
        const ruleForm2 = ref({
            past: '/Users/yinkaiyan/Desktop/my/uniapp/dist/build/h5/',
            new: '/Users/yinkaiyan/Desktop/download/'
        });
        const buildFun =  async () => {
            buildBtnLoading.value=true;
            const build = await postRequest("build",{
                "type":ruleForm1.value.type,
                'projectUrl':ruleForm1.value.projectUrl
            });
            console.log(build);
            buildBtnLoading.value=false;
            if(build.code=='0'){
                ElementPlus.ElMessage({
                    message: '项目打包成功',
                    type: 'success',
                });
                dialogVisible1.value=false;
            }else{
                ElementPlus.ElMessage.error('项目打包失败');
            };
        };
        const copyFolder =  async (query) => {
            fileSyncBtnLoading.value=true;
            const copyFolderData = await postRequest("fileSync",{
                "past":ruleForm2.value.past,
                "new":ruleForm2.value.new
            });
            console.log(copyFolderData);
            fileSyncBtnLoading.value=false;
            if(copyFolderData.code=='0'){
                ElementPlus.ElMessage({
                    message: '文件同步成功',
                    type: 'success',
                });
                dialogVisible2.value=false;
            }else{
                ElementPlus.ElMessage.error('文件同步失败');
            };
        };
        const submitForm1 = () => {
            if (!ruleForm1.value.type||!ruleForm1.value.projectUrl) {
                ElementPlus.ElMessage.error('参数为空');
                return
            };
            buildFun();
        };
        const submitForm2 = (formEl) => {
            if (!ruleForm2.value.past||!ruleForm2.value.new) {
                ElementPlus.ElMessage.error('参数为空')
                return
            };
            copyFolder();
        };
        const app = createApp({
            setup() {
                return {
                    buildFun,
                    copyFolder,
                    buildBtnLoading,
                    dialogVisible1,
                    ruleForm1,
                    submitForm1,
                    dialogVisible2,
                    ruleForm2,
                    submitForm2,
                    fileSyncBtnLoading
                };
            },
        });
        app.use(ElementPlus);
        app.mount('#counter');
    </script>
  </body>
</html>